<!--
 * @Author: wuzhen
 * @Date: 2019-12-03 14:04:35
 * @LastEditors: wuzhen
 * @LastEditTime: 2019-12-06 09:16:16
 * @Description: table表格删除组件
 -->

<template>
  <Modal :value="deleteModal" @on-visible-change="onChange" width="360">
    <p slot="header" style="color:#f60;text-align:center">
      <Icon type="ios-information-circle"></Icon>
      <span>确认删除</span>
    </p>
    <div style="text-align:center">
      <p>数据删除后将无法恢复</p>
      <p>是否继续删除?</p>
    </div>
    <div slot="footer">
      <Button type="error" size="large" long :loading="loading" @click="onDelete">删除</Button>
    </div>
  </Modal>
</template>

<script>
export default {
  name: "Delete",
  props: {
    deleteModal: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loading: false
    };
  },
  methods: {
    // 确定删除
    onDelete() {
      this.btnLoading(true);
      this.$emit("submit-delete");
    },
    // 删除按钮loading状态
    btnLoading(isload) {
      this.loading = isload;
    },
    onChange(isShow) {
      this.$emit("on-change", isShow);
    }
  }
};
</script>
